<!-- subpkg_consult/order_list/index.vue -->
<script lang="ts" setup>
import { ref } from "vue";
// 订单列表组件
import OrderList from "./components/order-list.vue";

// 标签索引值
const tabIndex = ref(0);
// 标签页数据
const orderTabs = ref([
  { label: "问医生", rendered: true },
  { label: "极速问诊", rendered: false },
  { label: "开药问诊", rendered: false },
]);
// 切换标签页
const onOrderTabChange = (i: number) => {
  tabIndex.value = i;
  // 每个标签页只被初始一次
  orderTabs.value[i].rendered = true;
};
</script>

<template>
  <view class="consult-page">
    <view class="consult-status-tabs">
      <custom-tabs :data="orderTabs" @change="onOrderTabChange"></custom-tabs>
    </view>

    <!-- 订单列表 -->
    <view v-for="(order, index) in orderTabs" :key="index" v-show="tabIndex === index">
      <order-list :type="index + 1" v-if="order.rendered" />
    </view>
  </view>
</template>

<style lang="scss"></style>
